<template>
  <div>
<h1>修改商品</h1>
    <table class="table table-bordered">
      <tbody>
      <tr>
        <td>酒店名称</td>
        <td><input type="text" v-model="info.HouseName"/></td>
      </tr>
      <tr>
        <td>价格</td>
        <td><input type="text" v-model="info.Money"/></td>
      </tr>
      <tr>
        <td>酒店服务</td>
        <td>
          <input type="checkbox" name="sever" v-model="info.HouseSerever" value="含早"/>含早
          <input type="checkbox" name="sever" v-model="info.HouseSerever" value="客房服务"/>客房服务
          <input type="checkbox" name="sever" v-model="info.HouseSerever" value="健身房"/>健身房
          <input type="checkbox" name="sever" v-model="info.HouseSerever" value="自助午餐"/>自助午餐
          <input type="checkbox" name="sever" v-model="info.HouseSerever" value="娱乐室"/>娱乐室
        </td>
      </tr>
      <tr>
        <td>照片</td>
        <td>
          <input type="file" @change="Img"/>
          <img :src="info.Photo" width="100" height="100"/>
        </td>
      </tr>
      <tr>
        <td>房间状态</td>
        <td>
          <input type="radio" name="State" v-model="info.State" :value="1"/>开启
          <input type="radio" name="State" v-model="info.State" :value="0"/>关闭
        </td>
      </tr>
      <tr>
        <td>开业时间</td>
        <td><input type="date" v-model="info.CreateTime"/></td>
      </tr>
      <tr>
        <td></td>
        <td><input type="button" value="修改" class="btn btn-warning" @click="updatelist"/></td>
      </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">
import {ref,reactive,onMounted} from 'vue'
import axios from "axios";
import {useRoute,useRouter} from "vue-router";
import moment from "moment";
const router = useRouter();
const route = useRoute();

onMounted(() => {
  Find();
})
const Find=()=>{

  axios({
    url:"http://localhost:5006/api/Room/Find",
    method:"get",
    params:{id:route.query.id}
  }).then((res)=>{
    console.log(res)
    Object.assign(info,res.data);
    info.HouseSerever=info.HouseSerever.split(',');
    info.CreateTime=moment(info.CreateTime).format('YYYY-MM-DD').substr(0,10);
  })
}
const Img=(e:any)=>{
  let obj=e.target.files[0];
  let f=new FormData();
  f.append("file",obj);
  axios({
    url:"http://localhost:5006/api/Img/Img",
    method:"post",
    data:f
  }).then((res)=>{
    if(res.data=="不是图片")
    {
      alert("图片格式不正确")
      return;
    }
    if(res.data=="大于1M")
    {
      alert("图片格式过大")
      return;
    }
    info.Photo=res.data;
  })
}
let info:any=reactive({
  "Id": route.query.id,
  "HouseName": "",
  "Money": "",
  "HouseSerever": [],
  "Photo": "",
  "State": "1",
  "SeverCount": "",
  "CreateTime": "",
})
const updatelist=()=>{
  info.SeverCount=info.HouseSerever.length;
  info.HouseSerever=info.HouseSerever.toString();
  axios({
    url:"http://localhost:5006/api/Room/UpdateHouse",
    method:"put",
    data:info
  })
  .then((res)=>{
    console.log(res)
    if(res.data>0)
    {
      alert("修改成功")
      router.push("/houseList");
    }
    else
    {
      alert("修改失败")
    }
  })
}

</script>

<style>

</style>